<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ko">
<head>
<title>기본 예제</title>
<meta name="class-lists" content="jindo.FloatingLayer"/>
<meta name="screenshots" content=""/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta name="description" content="페이지의 좌상, 우상, 좌하, 우하 코너 4곳에 플로팅 레이어를 고정시키는 예제입니다.">
<link rel="stylesheet" type="text/css" href="../asset/demo.css">
<style type="text/css">
	.layer { border:1px solid #000; position:absolute; width:100px; height:100px; background:#ddd; padding:10px; }
</style>
</head>
<body style="position:relative;">
<script type="text/javascript" src="../asset/demojs/demo.js#header"
     data-title="Jindo Component"
     data-subtitle="=document.title"
     data-backbutton="false"
     data-viewsource="false"
     data-qrcode="true"></script>
     
<div class="layer" id="LU_layer" style="left:10px; top:10px;">
	왼쪽 상단에 고정
</div>
<div class="layer" id="RU_layer" style="right:10px; top:10px;">
	오른쪽 상단에 고정
</div>
<div class="layer" id="LD_layer" style="left:10px; bottom:10px;">
	왼쪽 하단에 고정
</div>
<div class="layer" id="RD_layer" style="right:10px; bottom:10px;">
	오른쪽 하단에 고정
</div>
	
<div style="padding:10px">
	Gee - 소녀시대
	<pre>
Aha! Listen Boy My First Love Story
My Ange & My Girls
My Sunshine
Oh! Oh! let's go!
너무너무 멋져 눈이 눈이 부셔
숨을 못 쉬겠어
떨리는 Girl
Gee Gee Gee Gee Baby Baby Baby
Gee Gee Gee Gee Baby Baby Baby

Oh 너무 부끄러워 쳐다볼 수 없어
사랑에 빠졌어 수줍은 Girl
Gee Gee Gee Gee Baby Baby Baby
Gee Gee Gee Gee Bab Bab Bab Bab Bab Bab

어떻게 하죠 (어떡하죠)
떨리는 나는 (떨리는 맘은요)
(두근 두근 두근 두근)
두근 두근거려 잠을 전혀 못 이루죠

나는 나는 바본가봐요
그대 그대밖에 모르는 바보
그래요 그댈 보는 난

너무 반짝반짝 눈이부셔 No No No No No
너무 깜짝깜짝 놀란 나는 Oh Oh Oh Oh Oh
너무 짜릿짜릿 몸이 떨려 Gee Gee Gee Gee Gee
Oh  젖은 눈빛 Oh Ye 좋은 향기 Oh Ye Ye Ye

Oh 너무 너무 예뻐 맘이 너무 예뻐
첫눈에 반했어 꼭 찍은 Girl
Gee Gee Gee Gee Baby Baby Baby
Gee Gee Gee Gee Baby Baby Baby

너무나 뜨거워 만질 수가 없어
사랑에 타버려 후끈한 Girl
Gee Gee Gee Gee Baby Baby Baby
Gee Gee Gee Gee Bab Bab Bab Bab Bab Bab

어쩌면 좋아(어쩌면 좋아요)
수줍은 나는(수줍은 나는요)
(몰라 몰라 몰라 몰라)
몰라하며 매일 그대만 그리죠
그대 친구들은 말하죠
정말 너는 정말 못말려 바보
하지만 그댈 보는 난

너무 반짝반짝 눈이부셔 No No No No No
너무 깜짝깜짝 놀란 나는 Oh Oh Oh Oh Oh
너무 짜릿짜릿 몸이 떨려 Gee Gee Gee Gee Gee
젖은 눈빛 Oh Ye 좋은 향기 Oh Ye Ye Ye

말도 못했는 걸
너무 부끄러워 하는 날
용기가 없는걸까
어떻해야 좋은걸까
두근두근 맘 졸이며 바라보고 있는 난

너무 반짝반짝 눈이부셔 No No No No No
너무 깜짝깜짝 놀란 나는 Oh Oh Oh Oh Oh
너무 짜릿짜릿 몸이 떨려 Gee Gee Gee Gee Gee
젖은 눈빛 Oh Ye 좋은 향기 Oh Ye Ye Ye

너무 반짝반짝 눈이부셔 No No No No No
너무 깜짝깜짝 놀란 나는 Oh Oh Oh Oh Oh
너무 짜릿짜릿 몸이 떨려 Gee Gee Gee Gee Gee
젖은 눈빛 Oh Ye 좋은 향기 Oh Ye Ye Ye</pre>
</div>

<script type="text/javascript" charset="utf-8" src="../../asset/jindo.desktop.all.ns.js"></script>
<script type="text/javascript" charset="utf-8" src="../../source/jindo.Component.js"></script>
<script type="text/javascript" charset="utf-8" src="../../source/jindo.UIComponent.js"></script>
<script type="text/javascript" charset="utf-8" src="../../source/jindo.Timer.js"></script>
<script type="text/javascript" charset="utf-8" src="../../source/jindo.Effect.js"></script>
<script type="text/javascript" charset="utf-8" src="../../source/jindo.Transition.js"></script>
<script type="text/javascript" charset="utf-8" src="../../source/jindo.FloatingLayer.js"></script>
<script type="text/javascript">
	var LU = new jindo.FloatingLayer(jindo.$('LU_layer'));
	var RU = new jindo.FloatingLayer(jindo.$('RU_layer'));
	var LD = new jindo.FloatingLayer(jindo.$('LD_layer'));
	var RD = new jindo.FloatingLayer(jindo.$('RD_layer'));
</script>
<script type="text/javascript" src="../asset/demojs/demo.js#footer"></script>
</body>
</html>
